<template>
  <el-date-picker
    :clearable="false"
    v-model="timeValueSy"
    type="year"
    placeholder="请选择年份"
    :default-value="timeValueSy"
    @change="optTimeSy"
    value-format="YYYY"
    :disabled-date="pickerOptions"
  >
  </el-date-picker>
</template>

<script setup lang="ts">
import { ref, defineProps, onMounted, defineEmits } from "vue";

const timeValueSy = ref<any>(null);
const emit = defineEmits(["timeValueChange"]);
// 接收参数
const props = defineProps({
  type: {
    type: Object,
    default: () => {},
  },
});

if (props.type.type == 4) {
  timeValueSy.value = props.type.startTimes + "01";
}
if (props.type.type == 44) {
  timeValueSy.value = props.type.endTimes + "01";
}

const pickerOptions = (time: any) => {
  if (props.type.type == 4) {
    if (new Date().getFullYear() >= time.getFullYear() && time.getFullYear() >= props.type.startTimes) {
      return false;
    } else {
      return true;
    }
  }
  if (props.type.type == 44) {
    if (time.getFullYear() <= props.type.endTimes) {
      return false;
    } else {
      return true;
    }
  }
};

const optTimeSy = (value: any) => {
  let dataValue = {
    type: props.type.type,
    times: value,
  };
  emit("timeValueChange", dataValue);
};
onMounted(() => {});
</script>
<style scoped lang="less"></style>
